<div class="page-bar">
    <ul class="page-breadcrumb">
        <li>
            <a href="#">WMS</a>
            <i class="fa fa-circle"></i>
        </li>
        <li>
            <a href="#">Task</a>
            <i class="fa fa-circle"></i>
        </li>
        <li>
            <a>Transload Task</a>
        </li>
    </ul>
</div>
<div class="container-fluid" style="margin:15px">
    <div class="row">
        <div class="portlet light bordered">
            <div class="portlet-title">
                <div class="caption">
                    <span class="caption-subject bold"> Transload Task List</span>
                </div>
            </div>
            <div class="portlet-body form form-horizontal">
                <form>
                    <div class="row form-group">
                        <div class="col-md-3">
                            <label>Task ID</label>
                            <lt-tags-input ng-model="searchInfo.taskIds" placeholder="Enter Task ID" fill="TASK-" ng-keyup="keyUpSearch($event)"></lt-tags-input>
                        </div>
                        <div class="col-md-3">
                            <label>Status</label>
                            <task-status-auto-complete allow-clear="true" ng-model="searchInfo.status"></task-status-auto-complete>
                        </div>
                        <div class="col-md-3">
                            <label>Assignee</label>
                            <user-auto-complete name="assignee" allow-clear="true" ng-model="searchInfo.assigneeUserId"></user-auto-complete>
                        </div>
                        <div class="col-md-3">
                            <label>Customer</label>
                            <organization-auto-complete ng-model="searchInfo.customerId" name="customer" tag="Customer"></organization-auto-complete>
                        </div>
                    </div>
                    <div class="row form-group">
                        <div class="col-md-3">
                            <label>Receipt ID</label>
                            <lt-tags-input ng-model="searchInfo.receiptIds" placeholder="Enter Receipt ID" fill="RN-" ng-keyup="keyUpSearch($event)"></lt-tags-input>
                        </div>
                        <div class="col-md-3">
                            <label>Load ID</label>
                            <lt-tags-input ng-model="searchInfo.loadIds" placeholder="Enter Load ID" fill="LOAD-" ng-keyup="keyUpSearch($event)"></lt-tags-input>
                        </div>
                        <div class="col-md-3">
                            <label>Entry ID</label>
                            <lt-tags-input ng-model="searchInfo.entryIds" placeholder="Enter Entry ID" fill="ET-" ng-keyup="keyUpSearch($event)"></lt-tags-input>
                        </div>
                    </div>
                    <div class="row form-group">
                        <div class="col-md-3">
                            <label>Start Time</label>
                            <lt-date-time placeholder="From" date-format="yyyy-mm-dd hh:ii" minute-step="60"
                                          value="searchInfo.startTimeFrom"></lt-date-time>
                        </div>
                        <div class="col-md-3" style="padding-top: 25px;">
                            <lt-date-time placeholder="To" date-format="yyyy-mm-dd hh:ii" minute-step="60"
                                          value="searchInfo.startTimeTo"></lt-date-time>
                        </div>
                        <div class="col-md-3">
                            <label>End Time</label>
                            <lt-date-time placeholder="From" date-format="yyyy-mm-dd hh:ii" minute-step="60"
                                          value="searchInfo.endTimeFrom"></lt-date-time>
                        </div>
                        <div class="col-md-3" style="padding-top: 25px;">
                            <lt-date-time placeholder="To" date-format="yyyy-mm-dd hh:ii" minute-step="60"
                                          value="searchInfo.endTimeTo"></lt-date-time>
                        </div>
                    </div>
                    <div>
                        <div class="row form-actions right">
                            <button type="button" class="btn blue" ng-click="search()">Search</button>
                        </div>
                    </div>
                </form>
                <div ng-show="!searchTaskCompleted" class="text-center">
                    <img src="assets/img/loading-spinner-grey.gif" ><span >&nbsp;LOADING...</span>
                </div>
                <div ng-show="searchTaskCompleted" class="dataTables_wrapper no-footer">
                    <div class="table-scrollable">
                        <table class="table table-striped table-bordered table-hover table-checkable order-column dataTable no-footer" id="sample_1" role="grid" aria-describedby="sample_1_info">
                            <thead>
                            <tr role="row">
                                <th> Task ID </th>
                                <th> Status </th>
                                <th> Customer </th>
                                <th> Assignee </th>
                                <th> PO No</th>
                                <th> Container No.</th>
                                <th> Entry ID</th>
                                <th> Receipt ID </th>
                                <th> load ID </th>
                                <th> Start Time </th>
                                <th> End Time </th>
                                <th> Converted </th>
                                <!--<th> Action </th>-->
                            </tr>
                            </thead>
                            <tbody>
                            <tr  ng-repeat="transloadTask in tasks track by $index">
                                <td><a ui-sref="wms.task.transloadTask.view({taskId:transloadTask.id})" target="_blank">{{transloadTask.id}}</a></td>
                                <td>{{transloadTask.status}}</td>
                                <td>{{transloadTask.customerName}}</td>
                                <td>{{transloadTask.assignee.firstName}} {{transloadTask.assignee.lastName}}</td>
                                <td>{{transloadTask.poNo}}</td>
                                <td><span ng-repeat="Container in transloadTask.containerNOs">
                                  {{Container}}
                                    &nbsp;</span></td>
                                <td>
                                    <span ng-repeat="entryId in transloadTask.entryIds">
                                    <a ng-href="{{'#/cf/facility/window/checkin/' + entryId + '/' + entryId + '/carrier-info'}}" target="_blank">{{entryId}}
                                        <span ng-if="dockMapByEntry[entryId].dockName"> &nbsp;(&nbsp;{{dockMapByEntry[entryId].dockName}}&nbsp;)</span>
                                    </a>
                                    &nbsp;</span></td>
                                <td><a ng-href="{{'#/wms/inbound/receipt/' + transloadTask.receiptId}}" target="_blank">{{transloadTask.receiptId}}</a></td>
                                <td><span ng-repeat="loadId in transloadTask.loadIds">
                                    <a title="{{orderMapByload[loadId].toString()}}" ng-href="{{'#/wms/outbound/load/' + loadId}}" target="_blank">{{loadId}}</a>&nbsp;
                                </span></td>
                                <td>{{transloadTask.startTime | amDateFormat:'YYYY-MM-DD HH:mm'}}</td>
                                <td>{{transloadTask.endTime | amDateFormat:'YYYY-MM-DD HH:mm' }}</td>
                                <td>{{transloadTask.isConvertedToGeneric ? 'Y':'N'}}</td>
                                <!--<td><a ui-sref="wms.inbound.transloadTask.view({taskId:transloadTask.id})" >View</a>  </td>-->
                            </tr>
                            </tbody>
                        </table>
                    </div>
                    <pager total-count="paging.totalCount" current-page ="paging.pageNo" page-size="pageObj.pageSize"  load-content="loadContent(currentPage)" ></pager>
                </div>
            </div>
            <!-- TABLE -->
        </div>
    </div>
</div>
